{% extends 'game_core/base.html' %}
{% load static %}

{% block content %}
<div class="home-container">
    <!-- 角色信息 -->
    <div class="character-info">
        <div class="character-header">
            <div class="character-avatar">
                <img src="{% static 'images/character.png' %}" alt="{{ character.name }}">
            </div>
            <h2>{{ character.name }}</h2>
        </div>
        <div class="stats">
            <p>等级: {{ character.level }}</p>
            <p>生命值: {{ character.base_hp }}</p>
            <p>攻击力: {{ character.base_attack }}</p>
            <p>防御力: {{ character.base_defense }}</p>
            <p>金币: {{ character.gold }}</p>
        </div>
    </div>

    <!-- 游戏数据统计 -->
    <div class="game-stats">
        <h3>游戏统计</h3>
        <div class="stats-grid">
            <div class="stat-item">
                <span class="stat-label">最高层数</span>
                <span class="stat-value">{{ character.highest_floor }}</span>
            </div>
            <div class="stat-item">
                <span class="stat-label">击杀怪物</span>
                <span class="stat-value">{{ character.monsters_killed }}</span>
            </div>
            <div class="stat-item">
                <span class="stat-label">总获得金币</span>
                <span class="stat-value">{{ character.total_gold_earned }}</span>
            </div>
            <div class="stat-item">
                <span class="stat-label">游戏次数</span>
                <span class="stat-value">{{ character.games_played }}</span>
            </div>
        </div>
    </div>

    <!-- 主要功能 -->
    <div class="main-actions">
        <a href="{% url 'game_core:start_game' %}" class="action-button start-game">开始冒险</a>
        {% if active_session %}
            <a href="{% url 'game_core:continue_game' session_id=active_session.id %}" class="action-button continue-game">继续冒险</a>
        {% endif %}
        <a href="{% url 'game_core:upgrade' %}" class="action-button upgrade">角色升级</a>
    </div>
</div>

<style>
    .home-container {
        max-width: 800px;
        margin: 0 auto;
        padding: 20px;
    }

    .character-info {
        background: #f5f5f5;
        padding: 20px;
        border-radius: 8px;
        margin-bottom: 20px;
    }

    .game-stats {
        background: #f5f5f5;
        padding: 20px;
        border-radius: 8px;
        margin-bottom: 20px;
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-top: 15px;
    }

    .stat-item {
        background: white;
        padding: 10px;
        border-radius: 5px;
        text-align: center;
    }

    .stat-label {
        display: block;
        color: #666;
        font-size: 0.9em;
    }

    .stat-value {
        font-size: 1.2em;
        font-weight: bold;
        color: #333;
    }

    .main-actions {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .action-button {
        padding: 15px;
        text-align: center;
        border-radius: 8px;
        color: white;
        text-decoration: none;
        font-weight: bold;
        transition: transform 0.2s;
    }

    .action-button:hover {
        transform: translateY(-2px);
    }

    .start-game { background: #4CAF50; }
    .continue-game { background: #2196F3; }
    .upgrade { background: #9C27B0; }

    .character-header {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
    }

    .character-avatar {
        margin-right: 20px;
    }

    .character-avatar img {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        border: 3px solid #fff;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    }
</style>
{% endblock %} 